.order-details-page {
    height: 100%;
    width: 100%;
    overflow: scroll;
    padding-bottom: 44px;
    .title-bar-detail {
        position: fixed;
    }
    .main-body {
        min-width: 1024px;
        width: 90%;
        padding-top: 60px;
        margin: 0 auto;
        max-width: 1920px;
        .order-detail-header {
            height: 200px;
            width: 100%;
            display: -webkit-box;
            display: -moz-box;
            display: -webkit-flex;
            display: -moz-flex;
            display: -ms-flexbox;
            display: flex;
            flex-flow: row;
            justify-content: space-between;
            .status-now{
                width: 20%;
                height: 200px;
                background: #FFFFFF;
                -webkit-box-shadow: 3px 3px 20px #999;
                -moz-box-shadow: 3px 3px 20px #999;
                -o-box-shadow: 3px 3px 20px #999;
                -ms-box-shadow: 3px 3px 20px #999;
                box-shadow: 3px 3px 20px #999;
                display: -webkit-box;
                display: -moz-box;
                display: -webkit-flex;
                display: -moz-flex;
                display: -ms-flexbox;
                display: flex;
                flex-flow: column;
                justify-content: space-around;
                span {
                    font-size: 16px;
                    text-align: center;
                }
                .active {
                    color: #FF6633;
                    font-size: 24px;
                    font-weight: bold;
                }
            }
            .remark-info{
                width: 54%;
                height: 200px;
                background: #FFFFFF;
                display: -webkit-box;
                display: -moz-box;
                display: -webkit-flex;
                display: -moz-flex;
                display: -ms-flexbox;
                display: flex;
                flex-flow: row;
                justify-content: space-around;
                align-items: center;
                padding: 15px;
                div {
                    width: 100px;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }
                textarea {
                    width: 90%;
                    height: 90%;
                }

            }
            .history{
                width: 25%;
                height: 200px;
                background: #FFFFFF;
                display: flex;
                flex-flow: column;
                align-items: center;
                justify-content: center;
                span {
                    margin-top: 15px;
                }
            }
        }
        .table {
            margin-top: 30px;
            .table-row{
                span{
                    width: 12%;
                }
                .number{
                    min-width: 150px;
                }
            }
        }
    }
}
